<!DOCTYPE html>
<!--suppress ALL -->
<html lang="zh-cn">
<!--<html lang="en" xmlns:th="http://www.thymeleaf.org">-->
<head>
    <meta charset="utf-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"/>

    <title>消息管理</title>

    <link rel="stylesheet" type="text/css" href="/src/css/themes/default.css"/>
    <!-- iview样式 -->
    <link rel="stylesheet" type="text/css" href="/plugins/iview/css/iview.css"/>
    <!--@import url("//unpkg.com/iview/dist/styles/iview.css");-->
    <!--<link rel="stylesheet" type="text/css" href="//unpkg.com/iview/dist/styles/iview.css"/>-->
    <!-- 引入layui样式 -->
    <link rel="stylesheet" href="/plugins/layui/css/layui.css" media="all"/>
    <link rel="stylesheet" href="/plugins/popover/popover.css">
    <!--   <script src="//unpkg.com/vue/dist/vue.js"></script>
       <script src="//unpkg.com/iview/dist/iview.min.js"></script>-->
    <!-- 引入vue -->
    <script type="text/javascript" src="/plugins/vue/vue.min.js"></script>
    <!-- iview js -->
    <script type="text/javascript" src="/plugins/iview/js/iview.js"></script>
    <script src="/properties/config.js"></script>
    <!--引入layui.js-->
    <script src="/plugins/layui/layui.js"></script>
    <!--引入axios.js 用于ajax调用-->
    <script src="/plugins/axios/axios.min.js"></script>
    <script type="text/javascript" src="/plugins/jquery-1.9.1.min.js"></script>
    <script src="/build/js/appToken.js"></script>
    <script src="/plugins/popover/popover.js"></script>
</head>
<body>
<!--隐藏元素-->
<!--<p id="staffType"  th:attr="value=${staffType}"  hidden />-->
<!--使用v-cloak技术，在vue渲染完毕前隐藏页面，渲染完成后显示-->
<div id="app" v-cloak>

    <!-- 搜索工具框 开始-->
    <row style="padding: 10px">
        <i-col span="24">
            <Card>
                <p slot="title">
                    <Icon type="ios-search"></Icon>
                    搜索条件
                </p>
                <!--右上侧按钮列表-->
                <i-button slot="extra" type="info" :loading="loading" icon="ios-search" @click="toLoading"
                          style="margin-right:10px">
                    <span v-if="!loading">查询</span>
                    <span v-else>查询中...</span>
                </i-button>
                <i-button slot="extra" @click="handleReset('searchForm')" style="margin-right:10px">
                    <span>重置</span>
                </i-button>

                <!--查询表单内容-->
                <row :gutter="16">
                    <i-form ref="searchForm" :model="searchForm" label-position="right" :label-width="150">
                        <i-col span="8" >
                            <form-item label="发送服务类型：" prop="sendServer">
                                <i-select v-model="searchForm.sendServer"  style="width: 176px">
                                    <i-option value="1">邮件</i-option>
                                    <i-option value="2">钉钉</i-option>
                                </i-select>
                            </form-item>
                        </i-col>
                        <i-col span="8" >
                            <form-item label="关联月份：">
                                <date-picker v-model="searchForm.paydayTimeYear" type="month" placeholder="请选择"
                                             style="width: 176px"></date-picker>
                            </form-item>
                        </i-col>
                        <i-col span="8" >
                            <form-item label="发送类型：" prop="sendType">
                                <i-select v-model="searchForm.sendType" filterable style="width: 176px">
                                    <i-option value="1">考勤</i-option>
                                    <i-option value="2">工资</i-option>
                                </i-select>
                            </form-item>
                        </i-col>
                        <i-col span="8" >
                            <form-item label="发送状态：" prop="sendState">
                                <i-select v-model="searchForm.sendState" filterable style="width: 176px">
                                    <i-option value="0">发送成功</i-option>
                                    <i-option value="1">发送失败</i-option>
                                    <i-option value="2">已撤回</i-option>
                                </i-select>
                            </form-item>
                        </i-col>
                        <i-col span="8" >
                            <form-item label="确认状态：" prop="confirmState">
                                <i-select v-model="searchForm.confirmState" filterable style="width: 176px">
                                    <i-option value="0">未确认</i-option>
                                    <i-option value="1">已确认</i-option>
                                </i-select>
                            </form-item>
                        </i-col>

                        <i-col span="8" >
                            <form-item label="关键字：" prop="key">
                                <i-input v-model="searchForm.key" placeholder="姓名/工号" maxlength="30"
                                         style="width: 176px"></i-input>
                            </form-item>
                        </i-col>
                    </i-form>
                </row>
            </Card>
        </i-col>
    </row>
    <!--<div style="background-color:rgba(204, 235, 248, 1);height:30px;padding:5px 20px">-->
    <!--<lable style="color:#169BD5;margin-left: 30px;font-size:large">-->
    <!--&lt;!&ndash;应发总额:{{shouldPayAmount}},实发总额:{{actualPayAmount}},人员总计:{{personAmount}}，未发送:{{notSend}}，已发送:{{sended}},发送失败:{{sendFail}}, 已确认:{{confirmed}}, 未确认:{{notConfirm}}&ndash;&gt;-->
    <!--</lable>-->
    <!--</div>-->

    <!-- 搜索工具框 结束-->
    <!-- 表单Grid，使用layerUI的表格组件 开始 -->
    <row style="padding: 10px">
        <i-col span="24">
            <!-- 使用方法渲染模式 -->
            <table id="listTable" lay-filter="listTable" class="layui-hide"></table>
            <script type="text/html" id="barTools">
                <a class="layui-btn layui-btn-normal layui-btn-xs " lay-event="resend" ht-auth="resend">重发</a>
                <a class="layui-btn layui-btn-normal layui-btn-xs " lay-event="withdraw" ht-auth="withdraw">撤回</a>
            </script>


        </i-col>
    </row>
    <!-- 表单Grid，使用layerUI的表格组件 结束 -->

</div>
<script type="text/html" id="sendTypeTpl">
    {{#  if(d.sendType == 1){ }}
    考勤
    {{#  } else { }}
    工资
    {{# } }}
</script>
<script type="text/html" id="sendStateTpl">
    {{#  if(d.sendState == 0){ }}
    发送成功
    {{#  } else if(d.sendState == 1){ }}
    发送失败
    {{#  } else { }}
    已撤回
    {{#  } }}

</script>

<script type="text/html" id="confirmStateTpl">
    {{#  if(d.confirmState == 1){ }}
    已确认
    {{#  } else { }}
    未确认
    {{# } }}
</script>
<script src="/src/js/comm.js"></script>
<script src="/src/js/msgManagement/msgManagement.js"></script>

</body>
</html>